<template>
	<view class="content">
		<view class="detail" v-if="list.length > 0">
			<block v-for="(item, index) in list" :key="index">
				<view class="detail-li">
					<view class="detail-li__value">
						<view>{{ item.title }}</view>
						<view class="time">{{ item.createTime | dateFormatLine }}</view>
					</view>
					<view class="detail-li__money" :class="item.addStatus == 0 ? '' : 'active'"
						>{{ item.addStatus == 0 ? '+' : '-'
						}}{{ item.score + item.extraScore }}</view
					>
				</view>
			</block>
		</view>
		<LoadMore v-else :empty="true" emptyText="暂无数据"></LoadMore>
		<!--智能搜索-->
		<ai-search ref="aiSearch"></ai-search>
	</view>
</template>

<script>
import LoadMore from '@/components/LoadMore';

export default {
	data() {
		return {
			params: {
				page: 1,
				size: 20
			},
			list: [],
			pagination: {},
			isNull: false,
			isReachBottom: false
		};
	},
	components: {
		LoadMore
	},

	mounted() {
		this.getList({ ...this.params });
	},
	onShow() {
		this.$nextTick(() => {
			uni.getClipboardData({
				success: res => {
					if (res.data && this.$store.state.common.aiSearch) {
						this.$refs.aiSearch.open(res.data);
						this.$store.commit({
							type: 'setAiSearch',
							aiSearch: false
						});
					}
				}
			});
		});
	},
	onHide() {
		this.$refs.aiSearch.close();
	},

	methods: {
		getList(params) {
			this.$service.integral.score
				.detail(params)
				.then(res => {
					console.log(res);
					this.dataNext(res.list);
					this.pagination = res.pagination;
					if (res.pagination.total == 0) {
						this.isNull = true;
					} else {
						this.isNull = false;
					}
					uni.stopPullDownRefresh();
				})
				.catch(err => {
					uni.showToast({
						icon: 'none',
						title: err.message
					});
					uni.stopPullDownRefresh();
				});
		},
		dataNext(list) {
			if (this.pagination.page > 1) {
				this.list = this.list.concat(list);
			} else {
				this.list = list;
			}
		}
	},
	onPullDownRefresh() {
		this.getList({
			...this.params,
			page: 1
		});
	},
	onReachBottom() {
		if (
			this.pagination.page * (this.pagination.pageSize || this.pagination.size) >=
			this.pagination.total
		) {
			this.isReachBottom = true;
		} else {
			this.isReachBottom = false;
			this.getList({
				...this.params,
				page: this.pagination.page + 1
			});
		}
	}
};
</script>
<style lang="scss" scoped>
.content {
	height: 100vh;
	background: #f6f7fa;
	.detail {
		width: 714rpx;
		margin: auto;
		background: #ffffff;
		margin-top: 24rpx;
		margin-bottom: 40rpx;
		border-radius: 20rpx;
		.detail-li {
			@include flexBox(space-between, center);
			margin: 0 48rpx;
			padding: 30rpx 0rpx;
			border-bottom: 2rpx solid #f5f5f6;
			&__value {
				color: #383042;
				font-size: 28rpx;
				.time {
					color: #717076;
					font-size: 24rpx;
				}
			}
			&__money {
				color: #f70114;
				font-size: 40rpx;
				&.active{
					color: #171717;
				}
			}
		}
	}
}
</style>
